<template>
  <div class="opertion-box">
    <el-table :data="logList" style="width: 100%">
      <el-table-column label="操作时间" align="left" width="180px">
        <template slot-scope="scope">
          {{ scope.row.createTime | date-format('YYYY-MM-DD HH:mm') }}
        </template>
      </el-table-column>
      <el-table-column label="操作人" align="left" prop="userName" width="160px"></el-table-column>
      <el-table-column label="请求路径" align="left" prop="requestUrl"></el-table-column>
      <el-table-column label="请求参数" align="left" prop="requestParam">
        <template slot-scope="scope">
          <el-card>
            {{scope.row.requestParam}}
          </el-card>
        </template>
      </el-table-column>
      <el-table-column label="异常信息" align="left" prop="exceptionMessage"></el-table-column>
    </el-table>
    <Pagination @change="pageChange" :total="total" />
  </div>
</template>
<script>
  import { apiErrLog } from '@/api';
  export default {
    data() {
      return {
        logList: [],
        total: 0,
        pageSize: 30,
        currentPage: 1,
      };
    },
    created() {
      // 获取默认的企业key
      if (!this.$route.query.key && localStorage.getItem('userEnterpriseid') && this.$route.query.isAdd != 1) {
        this.$route.query.key = localStorage.getItem('userEnterpriseid');
      }
    },

    mounted() {
      if (this.$route.query.key) {
        this.getInfo();
      }
    },

    methods: {
      //table数据源
      async getInfo(type) {
        let res = await apiErrLog({
          pageSize: this.pageSize,
          currentPage: type ? this.currentPage : 1,
          enterpriseKey: this.$route.query.key,
        });
        this.logList = res.rows || [];
        this.total = res.total || 0;
      },
      //分页
      pageChange(e) {
        this.currentPage = e.currentPage;
        this.pageSize = e.pageSize;
        this.getInfo('more');
      },
      syntaxHighlight(json) {
        if (typeof json != 'string') {
          json = JSON.stringify(json, undefined, 2);
        }
        json = json.replace(/&/g, '&').replace(/</g, '<').replace(/>/g, '>');
        return json.replace(/("(\\u[a-zA-Z0-9]{4}|\\[^u]|[^\\"])*"(\s*:)?|\b(true|false|null)\b|-?\d+(?:\.\d*)?(?:[eE][+\-]?\d+)?)/g, function (match) {
          var cls = 'number';
          if (/^"/.test(match)) {
            if (/:$/.test(match)) {
              cls = 'key';
            } else {
              cls = 'string';
            }
          } else if (/true|false/.test(match)) {
            cls = 'boolean';
          } else if (/null/.test(match)) {
            cls = 'null';
          }
          return '<span class="' + cls + '">' + match + '</span>';
        });
      },
    },
  };
</script>
<style lang="scss" scoped>
  .opertion-box {
    padding: 10px 25px;
  }
  ::v-deep .el-table th.el-table__cell > .cell {
    padding-left: 0;
  }
  ::v-deep .el-table .cell,
  .el-table--border .el-table__cell:first-child .cell {
    padding-left: 0;
  }
</style>
